<%@ page contentType="text/html;charset=UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="tags" tagdir="/WEB-INF/tags"%>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags"%>
<c:set var="ctx" value="${pageContext.request.contextPath}" />
<html>
<head>
<title>微信平台配置</title>
<script type="text/javascript">
	var $appGrid;
	var $wxUserDataGrid;
	var $groupsDataGrid;
	var selectTableRow;//选中的行数据
	$(function() {
		$appGrid = $("#appGrid").datagrid($.extend(datagridOption, {
			title : '微信公共账号',
			url : "${ctx}/wx/wxManages/appDataGrid",
			toolbar : '#tt',
			columns : [ [ {
				field : 'ck',
				checkbox : true
			}, {
				field : 'originAppId',
				title : '应用ID',
				width : 100,
				sortable : true
			}, {
				field : 'appName',
				title : '应用名称',
				width : 100,
				sortable : true
			} ] ],

			onClickRow : function(rowIndex, rowData) {
				selectTableRow = rowData;
				fn_refreshApp();
			}
		}));

		$wxUserDataGrid = $("#wxUserDataGrid").datagrid($.extend(datagridOption, {
			url : "${ctx}/wx/wxManages/wxUserDataGrid",
			title : "",
			toolbar : "",
			columns : [ [ {
				field : 'ck',
				checkbox : true
			}, {
				field : 'openid',
				title : '用户标识',
				width : 80,
				sortable : true
			}, {
				field : 'nickname',
				title : '用户昵称',
				width : 100,
				sortable : true
			} ] ],
			onClickRow : function(rowIndex, rowData) {
			}
		}));
		$groupsDataGrid = $("#groupsDataGrid").datagrid($.extend(datagridOption, {
			title : "",
			toolbar : "",
			url : "${ctx}/wx/wxManages/groupsDataGrid",
			columns : [ [ {
				field : 'ck',
				checkbox : true
			}, {
				field : 'originGroupId',
				title : '分组ID',
				width : 120,
				sortable : true
			}, {
				field : 'groupName',
				title : '组名',
				width : 100,
				sortable : true
			} ] ],
			onClickRow : function(rowIndex, rowData) {
				selectTableRow = rowData;
				fn_refreshGroups();
			}
		}));
		$appGrid.datagrid('enableFilter');
		$wxUserDataGrid.datagrid('enableFilter');
		$groupsDataGrid.datagrid('enableFilter', [ {
			field : 'originGroupId',
			javaType : 'N',
			op : [ 'EQ', 'NEQ', 'GT', 'LT', 'GTE', 'LTE', 'ISNULL', 'NOTNULL' ]
		} ]);

		$("#refresh").click(function() {
			fn_refresh();
		});
	});

	function fn_refreshApp() {
		if (!selectTableRow) {
			$.messager.show({
				msg : "请先选定用户",
				icon : "warning",
				position : "bottomRight"
			});
			return false;
		}
		$wxUserDataGrid.datagrid("reload", {
			"search_EQ_app.id" : selectTableRow.id
		});
		$groupsDataGrid.datagrid("reload", {
			"search_EQ_app.id" : selectTableRow.id
		});
	}

	function fn_refreshGroups() {
		if (!selectTableRow) {
			$.messager.show({
				msg : "请先选定用户",
				icon : "warning",
				position : "bottomRight"
			});
			return false;
		}
		$wxUserDataGrid.datagrid("reload", {
			"search_EQ_groups.id" : selectTableRow.id
		});
	}

	function fn_refresh() {
		location.reload(true);
	}
</script>
</head>

<body class="easyui-layout" data-options="fit:true,border:false">
	<div data-options="region:'center'" data-options="fit:true"
		style="padding: 1px;">
		<div id="cc" class="easyui-layout" data-options="fit:true"
			style="width: 350px; height: 480px;">
			<div data-options="region:'west', split: true, collapsible:true"
				style="padding: 1px; witdh: 300px">
				<table id="appGrid">
				</table>
			</div>
			<div
				data-options="region:'center', title:'微信分组', split: true, collapsible:true"
				style="padding: 1px; witdh: 300px">
				<table id="groupsDataGrid">
				</table>
			</div>
			<div
				data-options="region:'east', title:'微信用户信息', split: true, collapsible:true"
				style="padding: 1px; witdh: 300px">
				<table id="wxUserDataGrid">
				</table>
			</div>
		</div>
	</div>
	<div id="tt" class="row">
		<div class="col-md-12">
			<shiro:hasPermission name="groups:update">
				<button id="refresh" type="button" class="btn btn-primary">
					<span class="glyphicon glyphicon-refresh"></span> 刷新
				</button>
			</shiro:hasPermission>
		</div>
	</div>
</body>
</html>
